<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no"/>
    <title>商品详情</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css"/>
    <link rel="stylesheet" type="text/css" href="../css/common.css"/>
    <link rel="stylesheet" type="text/css" href="../css/style.css"/>
    <link rel="stylesheet" type="text/css" href="../css/aui-flex.css"/>
    <style>
        .aui-tab-nav li{
            color:#90caf9 !important;
        }
        .aui-tab-nav li.active {
            color: #fff !important;
            border-bottom: 2px #fff solid !important;
        }
    </style>
</head>
<body>
<header class="aui-bar aui-bar-nav aui-border-b aui-flex-col">
<!-- <header class="aui-bar aui-bar-nav aui-border-b aui-flex-col aui-padded-0-10"> -->
    <div class="aui-flex-item-6">
        <div class="aui-pull-left  aui-padded-0 aui-text-left aui-iconfont aui-icon-left icon-left-coler aui-flex-item-2"
             tapmode
             onclick="closeWin()"></div>
        <ul class="aui-tab-nav  aui-flex-item-10 " style="background: none;">
            <li class="active good-info" data-type="good-info" tapmode onclick="changeCheck(this)">商品</li>
            <li class="good-detail" tapmode data-type="good-detail" onclick="changeCheck(this)">详情</li>
        </ul>
    </div>
    <div class="aui-flex-item-6 aui-text-right">
        <i class="aui-iconfont aui-icon-cart font-black aui-padded-0-5 positionARelative">
            <div class="aui-badge aui-bg-danger colorWhite positionAbsolute " tapmode onclick="goToHome(2)"
                 style="top:-6px;left: 17px;padding:3px 6px;">8
            </div>
        </i>
        <i class="aui-iconfont aui-icon-more font-black aui-padded-0-5"></i>
    </div>


</header>

    <footer class="aui-nav aui-flex-col display-hidden">
        <div class="aui-flex-item-2" tapmode onclick="goToSupplier()">
            <div class="aui-text-center aui-padded-5">
                <i class="aui-iconfont aui-icon-home"></i>
                <p style="font-size: 12px;">首页</p>
            </div>
        </div>
        <div class="aui-flex-item-5 addCar">
            <div class="myBtn aui-btn noBorder aui-btn-warning aui-btn-block aui-bg-warning radius-0 font-szie-16"
                 tapmode onclick="infoPageGoToBuy('addCar')">加入购物车
            </div>
        </div>
        <div class="aui-flex-item-5 goBuy" tapmode onclick="infoPageGoToBuy('buy')">
            <div class="myBtn">立即购买</div>
        </div>

    </footer>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/jquery.min.js"></script>
<script type="text/javascript">
    var goodId = "";
    apiready = function () {
        api.parseTapmode();
        var header = $api.dom('header');
        $api.fixIos7Bar(header);
        //$api.fixIos7Bar(header);
        goodId = api.pageParam.goodId;
        var footer = $api.dom('footer');
        var header_h = $api.offset(header).h;
        var footer_h = $api.offset(footer).h;
        var body_h = $api.offset($api.dom('body')).h - header_h - footer_h;
        api.openFrame({
            name: 'goodInfo_frm',
            url: 'goodInfo_frm.html',
            rect: {
                x: 0,
                y: header_h,
                w: 'auto',
                h: body_h
            },
            pageParam: {
                goodId: goodId
            },
            bounces: true,
            vScrollBarEnabled: false,
            hScrollBarEnabled: false
        });

        api.addEventListener({
            name: "changeChoose"
        }, function (ret, err) {
            if (ret && ret.value) {
                var type = ret.value.type;
                $("header").find("ul li").removeClass("active");
                $("." + type).addClass("active");
            }
        })
        api.addEventListener({
            name: "loadGoodFinish"
        }, function (ret, err) {
            if (ret && ret.value) {
                var goodType = ret.value.goodType;
                //消码订单
                if (goodType == "1") {
                    $(".addCar").hide();
                    $(".goBuy").addClass("aui-flex-item-10");
                }
                $("footer").removeClass("display-hidden");
            }
        })
//        api.addEventListener({
//            name:'viewappear'
//        }, function(ret, err){
//            api.setStatusBarStyle({
//                style : 'light'
//            });
//        });
    }
    function infoPageGoToBuy(type) {
        goToBuy(goodId,type);
    }
    function goToSupplier(){
        api.execScript({
            frameName:"goodInfo_frm",
            script:"goToSupplier()"
        })
    }
    //为了在下面的热门类别可以通用，单独出来
    function changeCheck(obj) {
        $(obj).parent().find("li").removeClass("active");
        $(obj).addClass("active");
        var type = $(obj).attr("data-type");
        api.execScript({
            frameName: "goodInfo_frm",
            script: "changeChoose('" + type + "')"
        })
    }
    function changeChoose(type) {

    }
</script>
</html>
